require('./lib/jquery-1.8.1.min')
require('./components/swiper.jquery.min')

document.querySelector('body').addEventListener('touchmove',function(event){
    event.preventDefault();
},false);

//全局音频类
var GlobalAudio = function($item) {
	//定义属性
	this._$globalAudio = $item; //容器对象
	this._$tip = $('<span></span>'); //文本提示容器
	this.audio = this._$globalAudio.find('audio')[0]; //获取音频控件
	this.isAllowManually = true; //是否允许手动操作
	this.playState = 'ready'; //当前播放状态

	//定义临时变量
	var theClass = this;

	//添加文本提示容器
	this._$globalAudio.append(this._$tip);

	//加载完成时自动播放
	if (this.audio.autoplay) {
		// this.audio.pause();
		setTimeout(function() {
			theClass.play();
		}, 2000);
	}

	//加载完成后才允许手动控制播放
	theClass.isAllowManually = true;
	//播放控制
	this._$globalAudio.on('click', function(e) {
		e.preventDefault();
		if (theClass.isAllowManually) {
			theClass._$globalAudio.is('.z-play') ? theClass.pause() : theClass.play();
		}
	});

	//修复ios/android 4.4下音频不播放的问题
	$(document).one('touchstart', function(e) {
		theClass.audio.play();
	});
};

//播放
GlobalAudio.prototype.play = function() {
	if (!this._$globalAudio.is('.z-play')) {

		this.audio.play();
		this._$globalAudio.removeClass('z-pause').addClass('z-play');
		this._showTip('开启');
		this.playState = 'playing';
	}
};

//暂停
GlobalAudio.prototype.pause = function() {
	if (!this._$globalAudio.is('.z-pause')) {
		this.audio.pause();
		this._$globalAudio.removeClass('z-play').addClass('z-pause');
		this._showTip('关闭');
		this.playState = 'pause';
	}
};

//显示提示
GlobalAudio.prototype._showTip = function(msg) {
	var theClass = this;
	this._$tip.text(msg);
	this._$tip.addClass('z-show');
	setTimeout(function() {
		theClass._$tip.removeClass('z-show');
	}, 1000);
};

var isWY = function () {
    var ua = navigator.userAgent.toLowerCase();
    if (ua.match(/MicroMessenger/i) == 'micromessenger' || ua.indexOf('yixin') > 0) {
        return true;
    } else {
        return false;
    }
};

var getSwiperHTML = function() {
    var root = window.LOADING_IMAGE_ROOT_URL || 'http://7xozxc.com1.z0.glb.clouddn.com/kaola/';
    return '<div class="swiper-container">\
    <div class="swiper-wrapper">\
        <div class="swiper-slide cover">\
            <img class="page-bg" src="' + root + 'img/cover.gif" alt=""/>\
        </div>\
        <div class="swiper-slide america">\
            <img class="page-bg" src="' + root + 'img/america.gif" alt=""/>\
        </div>\
        <div class="swiper-slide germany">\
            <img class="page-bg" src="' + root + 'img/germany.gif" alt=""/>\
        </div>\
        <div class="swiper-slide japan">\
            <img class="page-bg" src="' + root + 'img/japan.gif" alt=""/>\
        </div>\
        <div class="swiper-slide australia">\
            <img class="page-bg" src="' + root + 'img/australia.gif" alt=""/>\
        </div>\
        <div class="swiper-slide france">\
            <img class="page-bg" src="' + root + 'img/france.gif" alt=""/>\
        </div>\
        <div class="swiper-slide italy">\
            <img class="page-bg" src="' + root + 'img/italy.gif" alt=""/>\
            <img class="italy_run" src="' + root + 'img/italy_kola.gif" alt=""/>\
        </div>\
        <div class="swiper-slide britain">\
            <img class="page-bg" src="' + root + 'img/britain.gif" alt=""/>\
        </div>\
        <div class="swiper-slide denmark">\
            <img class="page-bg" src="' + root + 'img/denmark.gif" alt=""/>\
        </div>\
        <div class="swiper-slide korea">\
            <img class="page-bg" src="' + root + 'img/korea.gif" alt=""/>\
        </div>\
        <div class="swiper-slide end">\
            <div class="page-button">\
                <img class="bg" src="' + root + 'img/code.jpg" alt=""/>\
                <input class="copy" readonly value="kaola2016"/>\
                <a href="http://app.kaola.com/?from=topDownload" class="download"></a>\
            </div>\
            <img class="page-share" src="' + root + 'img/share.png" alt=""/>\
            <img class="page-korea" src="' + root + 'img/korea.gif" alt=""/>\
        </div>\
    </div>\
    <div class="swiper-button-prev swipeMove"></div>\
    <div class="swiper-button-next swipeMove"></div>\
    <div class="swiper-scrollbar"></div>\
    <a href="javascript:void(0);" class="u-globalAudio z-pause" style="display: none;">\
        <i class="icon-music"></i>\
        <audio src="' + root + 'img/music.mp3" autoplay="autoplay" loop="loop"></audio>\
        <span class="">开启</span>\
    </a>\
    </div>';
}

function preload (arrayOfImages, index) {
    var percent = 0;
    index = index || 0;
    if ( arrayOfImages && arrayOfImages.length && arrayOfImages.length > index ) {
        var img = new Image();
        img.onload = function () {
            percent = (index + 1) / 13;
            $('.num').text(Math.floor(percent * 100) + '%');
            if ( percent == 1 ) {
                $('#J_loading').hide();
                $(".swiper-viewport").html(getSwiperHTML());
                $('.swiper-container').css({
                    width: $(window).width() + 'px',
                    height: $(window).height() + 'px'
                });
                if ( !isWY() ) {
                    $('.page-share').hide();
                }
                new GlobalAudio($('.u-globalAudio'));
                initSwiper();
            } else {
                preload(arrayOfImages, index + 1);
            }
        };
        img.src = arrayOfImages[index];
    }
}


function initSwiper() {

    var swiper = new Swiper('.swiper-container', {
        followFinger: true,
        autoHeight: true,
        nextButton: '.swiper-button-next',
        prevButton: '.swiper-button-prev',
        scrollbar: '.swiper-scrollbar'
    });
}



$(document).ready(function() {

	var rootUrl = window.LOADING_IMAGE_ROOT_URL || 'http://7xozxc.com1.z0.glb.clouddn.com/kaola/';
    // 初始化定位
    $('.loadinner').css('top', (($(window).height() - 265) / 2) + 'px');

    var allImages = [
        rootUrl + 'img/cover.gif',
        rootUrl + 'img/america.gif',
        rootUrl + 'img/australia.gif',
        rootUrl + 'img/britain.gif',
        rootUrl + 'img/denmark.gif',
        rootUrl + 'img/france.gif',
        rootUrl + 'img/germany.gif',
        rootUrl + 'img/italy.gif',
        rootUrl + 'img/japan.gif',
        rootUrl + 'img/korea.gif',
        rootUrl + 'img/code.jpg',
        rootUrl + 'img/share.png',
        rootUrl + 'img/korea.jpg'
    ];
    preload(allImages);

});



